<!DOCTYPE html>
<!--suppress ALL -->
<html lang="en" xmlns:th="http://www.thymeleaf.org"
	  xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
	<title>注册</title>
<link rel="stylesheet" type="text/css" th:href="@{/css/style.css}">
<!-- <link rel="stylesheet/less" type="text/css" href="css/style.less" /> -->
<script type="text/javascript" th:src="@{/js/jquery-1.7.2.min.js}"></script>
<script type="text/javascript"  th:src="@{/js/all.js}"></script>
	<script type="text/javascript" th:src="@{/js/form-info.js}"></script>
<!--[if IE 6]> 
<script  th:src="@{/./js/iepng.js}" type="text/javascript"></script>
<script type="text/javascript">
   EvPNG.fix('div, ul, img, li, input,span, p');
</script>
<![endif]-->
</head>
<body>
<div class="reg_con_wper" id="app">
	<div class="reg_con px1000">
		   <div class="reg_box clearfix">
		   	   <div class="reg_box_l fl">
		   	   	  <img th:src="@{/images/reg_pic01.png}" alt="">
		   	   </div>
		   	   <div class="reg_box_r fl">
		   	   	    <h2 class="lg_sec_tit clearfix">
	  	   	     	      <span class="fl">注册</span>
	  	   	     	      <em class="fr">没有帐号，<a th:href="@{/login.html}">立即登录</a>       </em>
	  	   	     	</h2>
	  	   	     	<form id="formdtn" th:action="@{/users/userRegister}"  method="post" >
						<h3>
							<span th:if="results!=null" th:text="${results}" style="color: red"></span>
						</h3>
	  	   	     	   	    <fieldset>
	  	   	     	   	    	  <p class="mt20">
	  	   	     	   	    	  	 <input type="text" name="username" placeholder="用户名" required pattern="^[a-zA-Z0-9]{6,12}$" title="由3-12位字母数字组成" class="lg_input01 lg_input">
	  	   	     	   	    	  </p>
                                  <p class="mt20">
	  	   	     	   	    	  	 <input type="text" name="password" placeholder="密码" required pattern="^[a-zA-Z0-9]{6,12}$"  title="由6-12位字母数字组成" class="lg_input02 lg_input" >
	  	   	     	   	    	  </p>
                                  <p class="mt20">
	  	   	     	   	    	  	 <input type="text" name="ConfirmPass" placeholder="密码确认" required pattern="^[a-zA-Z0-9]{6,12}$" title="由6-12位字母数字组成" class="lg_input02 lg_input" >
	  	   	     	   	    	  </p>
									<p class="mt20">
									<input type="text" name="email" placeholder="用户邮箱"  required pattern="^\w[-\w.+]*@([A-Za-z0-9][-A-Za-z0-9]+\.)+[A-Za-z]{2,14}$" title="请输入格式正确的邮箱" class="lg_input03 lg_input" >
									</p>
                                  <p class="mt20">
	  	   	     	   	    	  	 <input type="text" name="phone" placeholder="手机号" required pattern="(\d{11})|^((\d{7,8})|(\d{4}|\d{3})-(\d{7,8})|(\d{4}|\d{3})-(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1})|(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1}))$" title="手机号的格式要正确" class="lg_input03 lg_input" >
	  	   	     	   	    	  </p>
                                  <p class="mt20 yanzheng">
	  	   	     	   	    	  	 <input type="text" name="phoneStatus"  placeholder="验证码" class="lg_input04 lg_input">
	  	   	     	   	    	  	 <input style="height: 40px;width:130px;background-color: orange;color: #f9f9fb" type="button" id="btn" value="免费获取验证码" onclick="settime(this)" />
								  </p>
                                   <p class="mt20">
	  	   	     	   	    	  	 <input type="text" name="inviteid" placeholder="邀请码" class="lg_input03 lg_input">
	  	   	     	   	    	  </p>
                                  <p class="pt10"><a href="">使用条款</a>&nbsp;&nbsp;<a href="">隐私条款</a></p>
                                 <p class="mt20"><input type="submit" value="立即注册" class="lg_btn"></p>
	  	   	     	   	    </fieldset>
	  	   	     	   </form>
		   	   </div>
		   </div>
	</div>
</div>
<script th:inline="javascript">
	var countdown=60;
	function settime(val) {
		if (countdown == 60) {
			captcha();
		}
		if (countdown == 0) {
			val.removeAttribute("disabled");
			val.value="免费获取验证码";
			countdown = 60;
			settime.stop();
		} else {
			val.setAttribute("disabled", true);
			val.value="重新发送(" + countdown + ")";
			countdown--;
		}
		setTimeout(function() {
			settime(val)
		},1000)
	}

	function captcha(){
				var phone=$("[name=phone]").val();
				if(phone!=""||phone!=null){
				var loginUrl = /*[[@{/users/userPhone}]]*/
				$.ajax({
					url:loginUrl,
					data:{"userPhone":phone},
					dataType:"text",
					type:"post",
					success:function(status){
						if (status=="0"){
							alert("手机号发送成功");
						}else if (status=="1") {
							alert("验证码发送达到上限,发送失败");
						}
						else if (status=="2") {
							alert("短信发送失败");
						}
						else if (status=="3") {
							alert("手机号不可为空!!!");
						}
					}

				})
				}
			}




</script>
</body>
</html>